Documentation by “on3-step"

---

“Metro Fullscreen Construction & Architecture Template”

---

Table of Contents

1. HTML Structure
2. CSS Files
3. Website Documentation
4. Contact Form

---

A) HTML structure - top

This template using Bootstrap, Need localhost software and run it on localhost, All the information within main content is nested within a div with id- name "content-wrapper" for all file. If you need more information you can read Bootstrap documentation on this link

 

1. Sample html structure page website

<div id="content-wrapper"> <!-- website -->

<div class="navbar navbar-default navbar-fixed-top"> <!-- navigation-->
 <div class="container-fluid">
   <div class="row">
   <!-- CONTENT NAV -->
  </div>
 </div> 
</div> 

<section  id="home"> <!-- content home -->
<div class="container-fluid">
<div class="row">
<div class="overlay-main">
  <!-- CONTENT HERE -->
</div>
</div>
</div>
</div> 
</section>
<!-- content home end -->

<!-- content  page -->
<section  id="about">
<div class="container-fluid">
   <div class="row">
   <!-- CONTENT HERE -->
   </div>
</div> 
</section>
<!-- content  page end -->
</div> <!-- website end -->

---

B) CSS Files - top

These are css files used in this template:

1. bootstrap.min.css - css by Twitter boostrap
2. animated-metro.css - used for element animation all of page
3. metro-style.css - main css files (you can edit color, font, etc from this css)
4. queries-metro.css - used for responsive style

You can change almost all styles from metro-style.css file.

/* CSS Document */


/* 
*
*
[Table of contents]
*
*
*

    font-metro / @import url
	reset / html
	general / body
	space / .space-single
	button / button
	devider / .devider
	section / section
	no select / .noselect
	wrapper / .content-wrapper
	whitepage / .whitepage
	preloader / .preloader
	navigation / .navbar-default
	home / #home
	background-img-metro / .mainbg
	about / #about h3
	service / .services img
	history / .bl-res-centered
	btn services / #services-list li
	projects / #projects-wrap
	projects detail 1 / .projects-detail h2
	projects detail 2 / #projectsBig .item
	team / .team-wrapper
	contact / .contactbg
	footer / .subfooter
	totop / #totop
	Blog & article / #content
	Blog comment / #blog-comment
	owl slider home / #owl-slider-home .item
	general popup / .white-popup-block
	
*
*
*/

---

C) Website Documentation - top

/*
Jquery metro.js

/* you can add and use animation in all element inside (not include popup ajax) example below */

 class="onStep" add class onStep in every element tag for animation triger 
 data-animation="fadeInUp" add class animation here from animated-metro.css
 data-time=0 is delay of element animation 

*/

---

E) Contact Form & subscribe - top

open send.php file change your email here:

    $email_to = "desmonlatandos@gmail.com"; // change with your email
    $name     = $_POST['name'];  
    $email    = $_POST['email'];
    $subject   = $_POST['subject'];
    $message    = $_POST['message'];
    
    $headers  = "From: $email\r\n";
    $headers .= "Reply-To: $email\r\n";
    
    if(mail($email_to, $subject, $message, $headers)){
    echo "success";       
    } 
    else{
    echo "failed";     
    }  

Once again, thank you so much for purchasing this template. As I said at the beginning, I'd be glad to help you if you have any questions relating to this template. No guarantees, but I'll do my best to assist. If you have a more general question relating to the template you might consider visiting the forums and asking your question in the "Item Discussion" section.

on3-step

Go To Table of Contents

---